<template>
    <div class="app-container">
      <div style="background-color: #fff">
        <div class="container-module" style="padding-bottom: 0">
          <el-form
            :inline="true"
            class="search-form"
            size="small"
            ref="searchForm"
            :model="searchForm"
          >
            <el-row style="display: flex">
              <div style="flex: 1">
                <el-form-item class="search-form-item" label="时间">
                  <el-date-picker
                    @change="domeTimeWay"
                    style="width: 100%"
                    value-format="yyyy-MM-dd"
                    v-model="establishTime"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </div>
              <div style="padding: 5px 0">
                <el-form-item>
                  <el-button
                    size="small"
                    type="primary"
                    icon="el-icon-search"
                    @click="getList"
                    >查询</el-button
                  >
                  <el-button
                    size="small"
                    type="primary"
                    icon="el-icon-refresh"
                    @click="resetting"
                    >重置</el-button
                  >
                </el-form-item>
              </div>
            </el-row>
          </el-form>
        </div>
        <el-divider></el-divider>
        <div style="padding: 0 20px">
            <div class="marginBottom">
          <el-row :gutter="20">
            <el-col :span="4" style="float: right">
              <div class="right-panel el-button-group">
                <el-button class="" icon="el-icon-refresh" size="mini" @click="getList"></el-button>
                <el-dropdown trigger="click" :hide-on-click="false">
                  <span class="el-dropdown-link">
                    <el-button class="" icon="el-icon-s-operation" size="mini"></el-button>
                  </span>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item v-for="fruit in allTableThead" :key="fruit">
                      <el-checkbox v-model="checkboxTableThead"
                        :label="fruit">{{ tableTheadOptions[fruit].label }}</el-checkbox>
                    </el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
            </el-col>
          </el-row>
        </div>
          <el-row :gutter="20">
            <el-col class="new_table_card">
              <el-table
                highlight-current-row
                :data="erroeList"
                :header-cell-style="{
                  'background-color': '#f3f8fe',
                  color: '#606266',
                  height: '50px',
                }"
                style="width: 100%"
                v-loading="loading"
              >
                <el-table-column
                  v-for="fruit in tableThead"
                  :key="fruit"
                  :label="tableTheadOptions[fruit].label"
                  min-width="80"
                  align="center"
                >
                  <template slot-scope="scope">
                    <div v-if="fruit == 'region'">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        :content="
                          scope.row.province_name + scope.row.city_name + ''
                        "
                        placement="top"
                      >
                        <div>
                          {{ scope.row.province_name }}{{ scope.row.city_name }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div v-else-if="fruit == 'monthly_transaction_number'">
                      <el-tooltip
                        placement="top-start"
                        :content="scope.row.deal.order_total_num + ''"
                      >
                        <div class="one_line_hidden">
                          {{ scope.row.deal.order_total_num }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div v-else-if="fruit == 'monthly_excuse_number'">
                      <el-tooltip
                        placement="top-start"
                        :content="scope.row.refund.refund_total_num + ''"
                      >
                        <div class="one_line_hidden">
                          {{ scope.row.refund.refund_total_num }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div v-else-if="fruit == 'monthly_sales_money'">
                      <el-tooltip
                        placement="top-start"
                        :content="scope.row.deal.price_total_num + ''"
                      >
                        <div class="one_line_hidden">
                          {{ scope.row.deal.price_total_num }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div v-else-if="fruit == 'monthl_ysales_money_actual'">
                      <el-tooltip
                        placement="top-start"
                        :content="scope.row.deal.price_total_num + ''"
                      >
                        <div class="one_line_hidden">
                          {{ scope.row.deal.price_total_num }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div v-else>
                      <el-tooltip
                        placement="top-start"
                        :content="scope.row[fruit] + ''"
                      >
                        <div class="one_line_hidden">
                          {{ scope.row[fruit] ? scope.row[fruit] : "-" }}
                        </div>
                      </el-tooltip>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column
                  align="center"
                  fixed="right"
                  width="180"
                  prop="address"
                  label="操作"
                >
                  <template slot-scope="scope">
                    <el-popconfirm
                      title="确定删除该日志吗？"
                      @confirm="delmansger(scope.row)"
                    >
                      <el-button type="text" slot="reference"> 删除 </el-button>
                    </el-popconfirm>
                  </template>
                </el-table-column>
              </el-table></el-col
            >
          </el-row>
          <el-row style="text-align: right">
            <pagination
              v-show="total > 0"
              :total="total"
              :page.sync="searchForm.page"
              :limit.sync="searchForm.count"
              @pagination="getList"
            />
          </el-row>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import { getBehaviorlist } from "@/api/admin/errorreporting";
  
  const tableTheadOption = {
    id: {
      label: "日志ID",
      field: "id",
    },
    admin_id: {
      label: "管理员id",
      field: "admin_id",
    },
    info: {
      label: "日志内容",
      field: "info",
    },
    ip: {
      label: "ip",
      field: "ip",
    },
    url: {
      label: "url",
      field: "url",
    },
    admin_name: {
      label: "管理员昵称",
      field: "admin_name",
    },
    created_at: {
      label: "创建时间",
      field: "created_at",
    },
    updated_at: {
      label: "更新时间",
      field: "updated_at",
    },
  };
  const allTableThead = [
    "id",
    "admin_id",
    "info",
    "ip",
    "url",
    "admin_name",
    "created_at",
    "updated_at",
  ];
  const defaultTableThead = [
    "id",
    "admin_id",
    "info",
    "ip",
    "url",
    "admin_name",
    "created_at",
    "updated_at",
  ];
  export default {
    name:"behaivor",
    components: {},
    data() {
      return {
        establishTime: [],
        erroeList: [],
  
        // 默认表头
        tableTheadOptions: tableTheadOption, //所有表头
        allTableThead: allTableThead,
        tableThead: defaultTableThead, // 默认表头
        checkboxTableThead: defaultTableThead, // 默认表头值
        tableKey: 1, // 为了保证table 每次都会重渲
  
        searchForm: {
          page: 1,
          count: 10,
        },
        total: 0,
      };
    },
    created() {
      this.getList();
    },
    methods: {
      // 获取列表
      getList() {
        this.loading = false;
        getBehaviorlist(this.searchForm).then((res) => {
          if (res.code !== 200 || res.status !== 1) {
            this.$messages.error(res.msg);
            this.loading = false;
            return;
          }
          this.erroeList = res.data.list;
          this.total = res.data.total;
          this.loading = false;
        });
      },
      domeTimeWay(val) {
        this.searchForm.start_time = val[0];
        this.searchForm.end_time = val[1];
      },
      //删除
      delmansger(row) {
        return;
        managerdelete({
          id: row.id,
        }).then((res) => {
          if (res.code !== 200 || res.status !== 1) {
            this.$messages.error(res.msg);
            return;
          }
          this.$messages.success(res.msg);
          this.getList();
        });
      },
  
      //重置
      resetting() {
        this.searchForm.page = 1;
        this.searchForm.count = 10;
        this.establishTime = [];
        this.getList();
      },
    },
  };
  </script>
  
  <style></style>
  